<template>
  <BasicForm @register="register" @get="getFormData" class="basicForm" />
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { BasicForm } from '@/components/Form';
  import { FormSchema, useForm } from '@/components/Form';
  import { getParkingByTrackId } from '@/api/home/parking';

  // 定义组件属性
  const props = defineProps({
    directionOptions: {
      type: Array,
      default: () => [],
    },
    trackOptions: {
      type: Array,
      default: () => [],
    },
    groupOptions: {
      type: Array,
      default: () => [],
    },
  });

  // 定义事件发射
  const emit = defineEmits([
    'update:directionOptions',
    'update:trackOptions',
    'update:groupOptions',
  ]);

  // 表单数据
  const formData = ref<any>({});

  // 股道选项
  const trackOptionsRef = ref<any[]>([]);

  // 班组选项
  const groupOptionsRef = ref<any[]>([]);

  // 停车选项
  const trackParkingOptions = ref<any[]>([]);

  // 编组是否禁用
  const isGroupDisabled = ref(true);

  // 表单结构定义
  const schemas: FormSchema[] = [
    {
      field: 'trainNumber',
      component: 'NInput',
      label: '车次',
      labelMessage: '',
      giProps: {
        span: 1,
      },
      componentProps: {
        maxlength: 32,
      },
      rules: [
        {
          required: true,
          message: '请输入车次',
          trigger: ['blur', 'submit'],
        },
      ],
    },
    {
      field: 'departureTime',
      component: 'NDatePicker',
      label: '离站时间',
      labelMessage: '',
      giProps: {
        span: 1,
      },
      componentProps: {
        type: 'datetime',
      },
      rules: [
        {
          required: true,
          message: '请选择离站时间',
          trigger: ['change', 'submit'],
        },
      ],
    },
    {
      field: 'taskTime',
      component: 'NDatePicker',
      label: '截止时间',
      labelMessage: '',
      giProps: {
        span: 1,
      },
      componentProps: {
        type: 'datetime',
      },
    },
    {
      field: 'trackId',
      component: 'NSelect',
      label: '股道',
      labelMessage: '',
      giProps: {
        span: 1,
      },
      componentProps: {
        multiple: false,
        filterable: true,
        remote: true,
        labelField: 'trackName',
        valueField: 'trackId',
        options: trackOptionsRef,
        onUpdateValue: async (val: string) => {
          if (val) {
            trackParkingOptions.value = await getParkingByTrackId({
              trackId: val,
            });
          } else {
            trackParkingOptions.value = [];
          }
          isGroupDisabled.value = !(trackParkingOptions.value.length > 0);
        },
      },
      rules: [
        {
          required: true,
          message: '请选择股道',
          trigger: ['change', 'submit'],
        },
      ],
    },
    {
      field: 'groupId',
      component: 'NSelect',
      label: '编组',
      labelMessage: '',
      giProps: {
        span: 1,
      },
      componentProps: {
        multiple: false,
        filterable: true,
        remote: true,
        labelField: 'groupName',
        valueField: 'groupId',
        disabled: isGroupDisabled,
        options: trackParkingOptions,
      },
      rules: [
        {
          required: true,
          message: '请选择编组',
          trigger: ['change', 'submit'],
        },
      ],
    },
    {
      field: 'teamId',
      component: 'NSelect',
      label: '作业班组',
      labelMessage: '',
      giProps: {
        span: 1,
      },
      componentProps: {
        multiple: false,
        filterable: true,
        remote: true,
        labelField: 'groupName',
        valueField: 'groupId',
        options: groupOptionsRef,
      },
      rules: [
        {
          required: true,
          message: '请选择作业班组',
          trigger: ['change', 'submit'],
        },
      ],
    },
  ];

  // 初始化表单
  const [register, { submit, setFieldsValue }] = useForm({
    gridProps: {
      cols: 2,
    },
    labelWidth: 105,
    layout: 'horizontal',
    showActionButtonGroup: false,
    schemas,
  });

  // 获取表单数据
  function getFormData(data: any) {
    formData.value = data;
  }

  // 设置表单数据
  async function setFormData(data: any, options: any = {}) {
    // 设置选项数据
    if (options.trackOptions) {
      trackOptionsRef.value = options.trackOptions;
    }
    
    if (options.groupOptions) {
      groupOptionsRef.value = options.groupOptions;
    }
    
    // 设置表单字段值
    await setFieldsValue(data);
    
    // 如果有trackId，加载停车信息
    if (data.trackId) {
      trackParkingOptions.value = await getParkingByTrackId({
        trackId: data.trackId,
      });
      isGroupDisabled.value = !(trackParkingOptions.value.length > 0);
    }
  }

  // 设置所有选项
  function setAllOptions(options: any) {
    if (options.trackOptions) {
      trackOptionsRef.value = options.trackOptions;
    }
    
    if (options.groupOptions) {
      groupOptionsRef.value = options.groupOptions;
    }
  }

  // 暴露方法给父组件
  defineExpose({
    submit,
    setFormData,
    setAllOptions,
    getFormData,
  });
</script>

<style scoped>
  .basicForm {
    /* 根据需要添加样式 */
  }
</style>